<template>
  <div class="news">
<!--     <tab :line-width=2 v-model="index">
      <tab-item selected>相关政策</tab-item>
      <tab-item>新闻资讯</tab-item>
    </tab> -->
    <div class="con-wrapper">
      <div v-show="index === 0">
        <!-- <news-list :congestio="item"  v-for="(item, i) in ZJdataList" :key="i" v-if="item.imgurl !== ''"></news-list> -->
        <div class="wrapList">
          <a id="news" href="http://www.gz.gov.cn/gzccjg/gzdt/201712/a5cbfb4a588f4c8eb893a2704331c402.shtml" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://www.gz.gov.cn/gzccjg/gzdt/201712/a5cbfb4a588f4c8eb893a2704331c402/images/82001e090c294e5c84d6bca431448a8f.jpg"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">广州市第三家国有住房租赁企业揭牌成立</p>
                <p class="newsLis_rt_body">广州市第三家国有住房租赁企业揭牌成立</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://news.163.com/17/1211/06/D5BT8GP500018AOP.html" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://szajimgs-1254325618.picgz.myqcloud.com/szajimgs/1514106846652936087.png"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">广东工行提供 200亿元支持 广州城投项目</p>
                <p class="newsLis_rt_body">广东工行提供 200亿元支持 广州城投项目</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://news.163.com/17/1121/01/D3NT9CN400014AEE.html" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://szajimgs-1254325618.picgz.myqcloud.com/szajimgs/1514106846652936087.png"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">工商银行5000亿元住房租赁市场建设资金落地</p>
                <p class="newsLis_rt_body">工商银行5000亿元住房租赁市场建设资金落地</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://news.163.com/17/0719/10/CPN05G84000187VE.html" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://cms-bucket.nosdn.127.net/catchpic/9/90/90ef9c658539111ebed26695d8562d9d.jpg?imageView&thumbnail=550x0"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">央媒解读广州“租购同权”新政：房屋租赁时代或到来</p>
                <p class="newsLis_rt_body">央媒解读广州“租购同权”新政：房屋租赁时代或到来</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://www.funxun.com/news/34/20171123100207.html" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://szajimgs-1254325618.picgz.myqcloud.com/szajimgs/1514106840807198280.png"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">三部委再提住房租赁 宅基地改革不以买卖为出发点</p>
                <p class="newsLis_rt_body">三部委再提住房租赁 宅基地改革不以买卖为出发点</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://news.southcn.com/gd/content/2017-11/17/content_178911510.htm" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://www.gz.gov.cn/gzccjg/gzdt/201712/a5cbfb4a588f4c8eb893a2704331c402/images/82001e090c294e5c84d6bca431448a8f.jpg"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">穗首批国有租赁住房企业揭牌 未来将获万亿元支持</p>
                <p class="newsLis_rt_body">穗首批国有租赁住房企业揭牌 未来将获万亿元支持</p>
              </div>
            </div>
          </a>
          <a id="news" href="http://society.people.com.cn/n1/2017/1107/c1008-29630434.html" class="newsCn">
            <div class="newsLis">
              <div class="newsLis_lf"><img src="http://szajimgs-1254325618.picgz.myqcloud.com/szajimgs/1514106844332657292.png"></div>
              <div class="newsLis_rt">
                <p class="newsLis_rt_head">房子如何保障住、防止炒</p>
                <p class="newsLis_rt_body">民生三问·为了人民的美好生活</p>
              </div>
            </div>
          </a>
        </div>
      </div>
<!--       <div v-show="index === 1">
        <news-list  v-for="(item, i) in HYdataList" :key="i"></news-list>
      </div> -->
    </div>
  </div>
</template>

<script>
import newsList from './child/newsList'
export default {
  name: 'news',
  components: {
    newsList
  },
  data () {
    return {
      index: 0,
      ZJdataList: '',
      HYdataList: [1, 2]
    }
  },
  created () {
    this.init()
  },
  methods: {
    init () {
      this.$axiosGeting(this.$api.consult).then(res => {
        if (res) this.ZJdataList = [...res.datas]
      })
    }
  }
}
</script>
<style scoped lang="less">
  .news{
    /*padding-top: 5px;*/
    box-sizing: border-box;
  }
  .con-wrapper {
    /*padding: 0 5px 0 15px;*/
    background: white;
  }
  .newsCn{
    padding: .75rem;
    display: block;
    border-bottom: 1px solid #f4f4f4;
    font-family: 'PingFang SC';
    .newsLis{
      position: relative;
      height: 4.7rem;
      .newsLis_lf{
        position: absolute;
        left: 0;
        top:0;
        width: 7.2rem;
        height: 4.7rem;
        img{
          width: 100%;
          height: 100%;
        }
      }
      .newsLis_rt{
        height: 4.7rem;
        position: absolute;
        left: 7.95rem;
        right: 0;
        p{
          color: #000;
          font-size: 0.85rem;
          line-height: 1.3;
        }
        p.newsLis_rt_body,p.newsLis_rt_head{
          display: -webkit-box;
          -webkit-line-clamp: 2;
          overflow: hidden;
          height: auto;
          -webkit-line-break: auto;
          -webkit-box-orient: vertical;
        }
        p.newsLis_rt_body{
          color: #999;
          font-size: 0.65rem;
          margin-top: 0.2rem;
          position: absolute;
          bottom: 0;
        }
        p.right-footer{
          color: #999;
          font-size: 0.6rem;
          position: absolute;
          bottom: 0;
          span{
            b{
              font-weight: 300;
            }
            b:nth-child(1){
              color: #000;
            }
          }
          span:nth-child(1){
            margin-right: 1.5rem;
          }
        }
      }
    }
  }
  .newsCn:last-child{
    border-bottom: 0;
  }
</style>
